layui.use(['element','layer'], function(){
    var element = layui.element,
        layer = layui.layer;

    element.on('nav(test)', function(elem){
       
        // 判断自定义属性data-click是否存在
       //console.log(this); //得到当前点击的DOM对象
        if(!this.attributes['data-click']){
            return;
        }
        var power = window.sessionStorage.getItem('power');
        power = JSON.parse(power);
        // 获取权限
        var powerEl = this.attributes['data-power'].value;
        //console.log(power, powerEl)
        if(power && powerEl){
            //console.log(power)
            if(power[powerEl] == 'false'){
                layer.alert('您没有权限访问!');
                return;
            }
        }
        //console.log(1);
       
        var title = this.innerHTML,
            content = this.attributes['lay-href'].value,
            id = this.attributes['data-id'].value;
           
        title = title.replace(/<\/?[^>]*>/g, '');
        
        if(!content) return console.log('自定义属性lay-href不存在');
        if(!id) return console.log('自定义属性data-id不存在');
        // 获取tab
        var layuiTabTitle = document.querySelector('.layui-tab-title');
        // 如果为true 说明tab存在, 反之则不存在
        var flag = false;
        for(var i=0, len=layuiTabTitle.children.length; i<len; i++){
            if(id == layuiTabTitle.children[i].attributes['lay-id'].value){
                flag = true;
                break;
            }
        }
        if(!flag){
            element.tabAdd('demo', {
                title: title,
                content: `<iframe src="${content}"></iframe>`,
                id: id
            });
        }
        //通过id切换到指定的Tab
        element.tabChange('demo', id);
    });

}); 

/**
 * 垂直盗汗蓝缩放与展开
*/
;(function(){
    var layuiNavBtn = document.querySelector('.layui-nav-btn'),
        layuiNavFloat = document.querySelector('.layui-nav-float'),
        layuiNavItem = layuiNavFloat.querySelectorAll('.layui-nav-item'),
        layuiTabFloat = document.querySelector('.layui-tab-float');
    var flag = true;
    function navInDexp(){
        if(flag){
            ind(this);
        }else{
            exp(this);
        }
    }
    // 缩放
    function ind(This){
        layuiNavFloat.style.width = "60px";
        layuiTabFloat.style.left = "60px";
        layuiNavFloat.classList.add('layui-nav-icon-home');
        This.children[0].classList.remove('layui-icon-shrink-right');
        This.children[0].classList.add('layui-icon-spread-left');
        flag = false;
    }
    // 展开
    function exp(This){
        layuiNavFloat.style.width = "200px";
        layuiTabFloat.style.left="200px";
        layuiNavFloat.classList.remove('layui-nav-icon-home');
        This.children[0].classList.remove('layui-icon-spread-left');
        This.children[0].classList.add('layui-icon-shrink-right');
        flag = true;
    }
    // 每一个li
    for(var i=0, len=layuiNavItem.length; i<len; i++){
        layuiNavItem[i].onclick = function(){
            exp(layuiNavBtn);
        }
    }

    layuiNavBtn.addEventListener('click', navInDexp);
})();


/**
 * 用户退出
*/